



import React, { useEffect, useState } from "react";

import img3 from "../cll/imgs/1.png"
import "./intereste.css"
import { useNavigate } from "react-router-dom"
import { Card, Button, InfiniteScroll, DotLoading, NavBar, Image } from 'antd-mobile';
import axios from "axios";

import moment from 'moment';

const api = "http://localhost:3000"

const demoSrc =
    'https://images.unsplash.com/photo-1567945716310-4745a6b7844b?ixid=MnwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8&ixlib=rb-1.2.1&auto=format&fit=crop&w=1500&q=60'
function Intereste() {

    const navigate = useNavigate()
    const back = () => {
        navigate(-1)
    }

    const [view, setview] = useState("感兴趣职位")
    // 获取职业
    const [list, setlist] = useState([])
    const getlist = () => {
        axios.get(`${api}/career`)
            .then(res => {
                setlist(res.data.data)
            })
    }

    // 感兴趣职业
    const newlist = () => {
        return [...list].filter(item => item.is_interested)
    }
    // 跳转到职业详情
    const handelcars = (id) => {

    }

    // 获取企业
    const [company, setcompany] = useState([])
    const getcompany = () => {
        axios.get(`${api}/company`)
            .then(res => {
                setcompany(res.data.data)
            })
    }

    // 感兴趣企业
     const newcopmany = () => {
        return [...company].filter(item => item.is_interested)
    }

    // 跳转到
    const handelcompany=(id)=>{

    }

    useEffect(() => {
        getlist(),
            getcompany()
    }, [])
    return (
        <div className="box">
            <div className="inster">
                <div>
                    <img src={img3} alt="" srcset="" className="img3" />
                </div>
                <NavBar onBack={back}>
                    <span style={{ display: "flex", justifyContent: "space-around" }}>
                        <p className={view === "感兴趣职位" ? "active1" : ""}
                            style={{ width: 100, height: 56, lineHeight: 3 }}
                            onClick={() => {
                                setview("感兴趣职位")
                            }}
                        >
                            <span

                            >感兴趣职位</span>
                        </p>
                        <p style={{ marginTop: 10 }}>
                            <span>|</span>
                        </p>
                        <p style={{ marginLeft: 2, width: 100, height: 56, lineHeight: 3 }}
                            className={view === "感兴趣企业" ? "active1" : ""}
                            onClick={() => {
                                setview("感兴趣企业")
                            }}
                        >
                            <span
                            >感兴趣企业</span>
                        </p>
                    </span>

                </NavBar>
                <div>
                    {
                        view === "感兴趣职位" ? (
                            <div>
                                {
                                    newlist().map((item) => {
                                        return (
                                            <Card key={item._id}
                                                style={{ borderRadius: '16px', marginTop: 6, height: 150, lineHeight: 3 }}
                                                className="card-shadow1"
                                                onClick={() => handelcars(item._id)}
                                            >
                                                <p className="career">
                                                    <span><h3>{item.careerName}</h3></span>
                                                    <span style={{ color: "red" }}><h3>{item.salary}</h3></span>
                                                </p>
                                                <p>
                                                    <span >{item.typeId.companyName}</span>
                                                    <span style={{ marginLeft: 10 }}>{item.typeId.financing}</span>
                                                    <span style={{ marginLeft: 10 }}>{item.typeId.companyCate}</span>
                                                    <span style={{ marginLeft: 10 }}>{item.typeId.companyNum}</span>
                                                </p>
                                                <p style={{ color: "rgb(171, 171, 171)" }}>
                                                    <span >{item.typeId.companyAddress}</span>
                                                    <span style={{ marginLeft: 10 }}>{item.xueli}</span>
                                                </p>

                                            </Card>
                                        )
                                    })
                                }
                            </div>
                        ) : (<div>
                            {
                                newcopmany().map((item) => {
                                    return (
                                        <Card
                                            key={item._id}
                                            style={{ borderRadius: '16px', marginTop: 6, height: 150, lineHeight: 3 }}
                                            className="card-shadow1"
                                            onClick={()=>handelcompany(item._id)}
                                        >
                                            <p style={{display:"flex",justifyContent:"space-between"}}>
                                                <div>
                                                    <span><h3>{item.companyName}</h3></span>
                                                    <span><h4>{item.companyAddress}</h4></span>
                                                </div>
                                                <div >
                                                    <Image
                                                        src={demoSrc}
                                                        width={64}
                                                        height={64}
                                                        fit='cover'
                                                        style={{ borderRadius: 32 }}
                                                    />
                                                </div>

                                            </p>
                                            <p style={{ color: "rgb(171, 171, 171)" }}>
                                                <span>
                                                    {item.financing}
                                                </span>
                                                <span style={{ marginLeft: 10 }}>
                                                    {item.companyNum}
                                                </span>
                                                <span style={{ marginLeft: 10 }}>本科</span>
                                            </p>
                                        </Card>
                                    )
                                })
                            }
                        </div>)
                    }


                </div>

            </div>
        </div>
    )
}

export default Intereste
